<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/page/public/taglib.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>审批配置</title>
<%@ include file="/WEB-INF/page/public/contentmeta.jsp"%>
<link rel="stylesheet" href="/plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="/css/global.css" media="all" />
<link rel="stylesheet" href="/css/tab.css" media="all" />
</head>
<body>

<div class="admin-tab admin-user">
    <div class="tab-condition">
        <form class="clefix"  action="/systemer/configurelistc${cid}_r${pid}" id="userlistform"> <!-- layui-form -->
            <div class="layui-form-item">
            	<input name="skipToPage" id="skipToPage"  type="hidden" value="${pager.pageNo}">
				<input type="hidden" id="pageNo" name="pageNo" value="${pager.pageNo}">
				<input type="hidden" id="totalPage" name="totalPage" value="${pager.totalPages}">
				<input type="hidden" value="${acid}" id="acid">
            </div>
        </form>
        <c:if test="${acid != 0}">
        	<div class="TM-tab-info">
        		<a href="javascript:history.go(-1);" class="layui-btn layui-btn-primary layui-btn-small">
        			<i class="layui-icon">&#xe603;</i>返回
        		</a>
        		<a class="layui-btn layui-btn-primary layui-btn-small addapproveuser">
        			<i class="layui-icon">&#xe642;</i>添加审批人
        		</a>
        	</div>
        </c:if>
    </div>
    <div class="layui-field-box">
    	<c:if test="${acid==0}">
    		<table class="site-table table-hover TM-user">
	           <thead>
		           <tr>
		               <th style="width:20%;">审批项名称</th>
		               <th style="width:10%;">审批流编号</th>
		               <th style="width:10%;">状态</th>
		               <th style="width:10%;">审批url模版</th>
		               <th style="width:10%;">审批类型</th>
		               <th style="width:10%;">备注</th>
		           </tr>
	           </thead>
	           <tbody>
		           <c:forEach var="obj" items="${pager.resultList}">
		           		<tr>
			                <td><a href="/systerm/approveConfig${obj.id}">${obj.name}</a></td>
			                <td>${obj.code}</td>
			                <td>${obj.state == 0 ?'启用':'禁用'}</td>
			                <td>${obj.urltemplate}</td>
			                <td>${obj.type}</td>
			                <td>${obj.remark}</td>
		            	</tr>
					</c:forEach>
	           </tbody>
	    	</table>
    	</c:if>
    	<c:if test="${acid!=0}">
    		<table class="site-table table-hover TM-user">
    			<thead>
		           <tr>
		               <th style="width:20%;">姓名</th>
		               <th style="width:10%;">用户id</th>
		               <th style="width:10%;">审批等级</th>
		               <th style="width:10%;">状态</th>
		               <th style="width:10%;">备注</th>
		               <th style="width:10%;">操作</th>
		           </tr>
	           </thead>
	           <tbody>
		           <c:forEach var="obj" items="${pager.resultList}">
		           		<tr>
			                <td>${obj.uname}</td>
			                <td>${obj.uid}</td>
			                <td>${obj.level}</td>
			                <td>${obj.state == 0 ?'启用':'禁用'}</td>
			                <td>${obj.remark}</td>
			                <td>
			                	<button class="layui-btn layui-btn-primary layui-btn-small upapproveuser" iddata="${obj.id}" uiddata="${obj.uid}" leveldata="${obj.level}" ><i class="layui-icon ">&#xe642;</i>修改</button>
			                	<button class="layui-btn layui-btn-primary layui-btn-small deleteapproveuser" iddata="${obj.id}" uiddata="${obj.uid}" leveldata="${obj.level}" ><i class="layui-icon ">&#xe642;</i>删除</button>
			                </td>
		            	</tr>
					</c:forEach>
	           </tbody>
    		</table>
    	</c:if>
	   	
        <div class="admin-table-page">
            <div id="page" class="page"></div>
        </div>	
    </div>
</div>

<!-- <div class="layui-form-item" id="updateone" style="width:90%;margin-top:20px;display:none">
	<form class="layui-form clefix" action=""  id="updateoneform" method="post">
		<div class="layui-form-item">
		    <label class="layui-form-label">审批人</label>
		    <div class="layui-input-block">
		    	<input type="text" class="layui-input" id="configitemname">
		    </div>
		</div>
	</form>
</div> -->

<div class="layui-form-item" id="setapprouser" style="width:90%;margin-top:20px;display:none">
	<form class="layui-form clefix" action="" id="setapprouserform" method="post">
		<div class="layui-form-item">
		    <label class="layui-form-label">审批人</label>
		    <div class="layui-input-block">
		    	<select id="uid" name="uid" value="">
		    		<option>请选择审批人</option>
		    	</select>
		    </div>
		</div>
		<div class="layui-form-item">
		    <label class="layui-form-label">审批人等级</label>
		    <div class="layui-input-block">
		    	<select id="level" name="level" value="">
		    		<option>请选择审批人等级</option>
		    	</select>
		    </div>
		</div>
		<input type="hidden" value="" id="oldlevel">
		<input type="hidden" value="" id="changetype">
		<input type="hidden" value="" id="changeid">
	</form>
</div>


<script>

	layui.use(['icheck','element','laypage','form'], function() {
		
		var $ = layui.jquery,
        laypage = layui.laypage,
        element = layui.element(); //Tab的切换功能，切换事件监听等，需要依赖element模块
 		var form = layui.form();
        
        var acid = $("#acid").val();
        
        //添加审批人
        $(".addapproveuser").on("click",function(){

        	//加载所有用户
        	var html = crm_user.getalluserwithdept(-1);
        	$("#uid").html(html);
        	//加载审批等级
        	var apphtml = approlevel.getapprolevellist(-1,acid);
        	$("#level").html(apphtml);
        	// $("#oldlevel").val(-1);
        	$("#changetype").val(0);
        	$("#changeid").val(0);
        	//更新页面
        	form.render('select');
        	//打开弹窗
        	layer.open({
				title: "添加审批人",
				maxmin: true,
				type: 1,
				content: $('#setapprouser'),
				btn: ['确认', '取消'],
				shadeClose:true,
				btnAlign:'c',
				area: ['500px', '400px'],
				yes : function(){
					$("#setapprouserform").submit();
				}
			});
        });
        
        //修改审批人
        $(".upapproveuser").on("click",function(){
        	
        	//修改审批人，要知道这个审批人现在的uid和等级
        	var olduid = $(this).attr("uiddata");
        	var oldlevel = $(this).attr("leveldata");
        	var id = $(this).attr("iddata");
        	//加载用户
        	var html = crm_user.getalluserwithdept(olduid);
        	$("#uid").html(html);
        	//加载审批等级
        	var apphtml = approlevel.getapprolevellist(oldlevel,acid);
        	$("#level").html(apphtml);
        	$("#changetype").val(1);
        	$("#changeid").val(id);
        	//更新页面
        	form.render('select');
        	//打开弹窗
        	layer.open({
				title: "修改审批人",
				maxmin: true,
				type: 1,
				content: $('#setapprouser'),
				btn: ['确认', '取消'],
				shadeClose:true,
				btnAlign:'c',
				area: ['500px', '400px'],
				yes : function(){
					$("#setapprouserform").submit();
				}
			});
        	
        });
        
        //删除审批人
        $(".deleteapproveuser").on("click",function(){
        	
        	var olduid = $(this).attr("uiddata");
        	var oldlevel = $(this).attr("leveldata");
        	var id = $(this).attr("iddata");
        	var acid = $("#acid").val();
        	
        	layer.confirm("确认删除该审核员吗？",{
        		btn:['确认','取消']
        	},function(){
        		layer.confirm("删除后不可恢复，确定删除吗？",{
        			btn:['确认','取消']
        		},function(){
                	$.ajax({
                		type : "post",
                		data : {id:id,acid:acid,level:oldlevel,uid:olduid},
                		url : "/systerm/deleteapproconfig",
                		dataType : "json",
                		async: false,
                		success : function(data){
                			if (data == 1) {
    							layer.msg("审批人删除成功",{icon: 1,time:500},function(){ window.location.reload();});
    						} else {
    							layer.msg("审批人删除失败",{icon: 2,time:500},function(){ window.location.reload();});
    						}             			
                		}
                	});
                	
        		},function(){
        			layer.msg("取消删除",{icon:1,time:700});
        		});
        	},function(){
        		layer.msg("取消删除",{icon:1,time:700});
        	});
        });
        
        
    	var pageNo = $("#pageNo").val();
    	var totalPage = $("#totalPage").val(); 
        //page
        laypage({
            cont: 'page',
            curr: pageNo//'${pager.pageNo}'
            ,pages: totalPage//'${pager.totalPages}' //总页数
            ,
            groups: 5 //连续显示分页数
            ,
            jump: function(obj, first) {
                //得到了当前页，用于向服务端请求对应数据
                var curr = obj.curr;
                if(!first) {
                	$("#skipToPage").val(curr);
                	$("#userlistform").submit();
                }
            }
        });
	});
	
	//审批等级选择列表
	var approlevel = {
		getapprolevellist : function(levelval,acid){
			var html = "<option value=''>请选择审批人等级</option>";
			$.ajax({
				type : "post",
				url : "/systerm/getapproveusercount",
				data : {acid:acid},
				dataType : "json",
				async: false,
				success : function(data){
					var totalcount;
					if (levelval == -1) {
						totalcount = data+1;
						levelval = data+1;
					} else {
						totalcount = data;
					}
					$("#oldlevel").val(levelval);
					var sel = "";
					for (var i = 1; i <= totalcount; i++) {
						sel = (levelval==i)?"selected":"";
						html +='<option value="'+i+'" '+sel+'>'
						+i+'</option>';
					}
				}
			});
			return html;
		}
	}
	
	//保存审批人新增或修改
	/**
		现在有一个问题，我新增或修改一个审批人，然后我改变了他的审批等级，然后相应的，其他人的审批等级也就会发生变化
		那现在就要看看有哪些情况了：
			新增：
				不改变位置，就在最后一位，皆大欢喜，不用改什么
				改变位置：改变位置之前的不用变，后面的每个level+1
			修改：
				不改变位置，也就是旧排位跟新排位一样，皆大欢喜，不用改什么。
				向前改变：改变位置之前不变，原先位置之后不变，只有位置之间的排序改变
				向后改变：原先位置之前不变，改变位置之后不变，只有位置之间的排序改变
		所以很关键的两个数据就是：原始位置，改变之后的位置，根据这两个值来确定范围
	*/
	$(function(){
		$("#setapprouserform").validate({
			rules: { },
			messages: { },
			submitHandler: function(form) {
				//获取参数
				var uid = $("#uid").val();
				var level = $("#level").val();
				var type = $("#changetype").val();
				var oldlevel = $("#oldlevel").val();
				var id = $("#changeid").val();
				var acid = $("#acid").val();
				layer.msg("修改中...",{icon: 1});
				$.ajax({
					type : "post",
					data : {uid : uid,level : level,type : type,oldlevel : oldlevel,id : id,acid : acid},
					url : "/systerm/changeapproconfig",
					dataType : "json",
					async: false,
					success : function(data){
						if (data == 1) {
							layer.msg("审批人修改成功",{icon: 1,time:500},function(){ window.location.reload();})
						} else {
							layer.msg("审批人修改失败",{icon: 2,time:500},function(){ window.location.reload();})
						}
					}
				});
	  		}
		}); 
	});

</script>



</body>
</html>